<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <meta name="format-detection" content="telephone=no" />
        <!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
        
        <script type="text/javascript" src="/js/libs/jquery-1.10.2.min.js"></script>

        <title>Stampa fattura!</title>

        <!--<style>

        * {
        	margin:0;
        	padding:0;
        }

        	@media print {
	        	.noPrint {
	        		display: none !important;
	        	}
	        }

	        @media screen {
/*
	        	@keyframes blink {
					0% {background-color: rgba(255,153,51,0.2)}
					50% {background-color: rgba(255,153,51,0.7)}
				}
				@-webkit-keyframes blink {
					0% {background-color: rgba(255,153,51,0.2)}
					50% {background-color: rgba(255,153,51,0.7)}
				}
*/
				#buttonsbar {
					display: block;
					width:100%;
					height:2rem;
					line-height: 2rem;
					text-align: center;
					border-bottom-left-radius: .5rem;
					border-bottom-right-radius: .5rem;
					-moz-border-bottom-left-radius: .5rem;
	        		-moz-border-bottom-right-radius: .5rem;
/*
	        		animation: blink 3s ease infinite;
	        		-webkit-animation: blink 3s ease infinite;
*/
	        		cursor: pointer !important;
				}

				#buttonsbar > div {
					background-color: #ff9933;
	        		color: black;
	        		transition: all .4s ease;
	        		-webkit-transition: all .4s ease;
	        		width: 50%;
	        		float: left;
	        	}

				#buttonsbar > div:hover {
					background-color: black;
	        		color: #ff9933;
				}
	        }
        </style>-->

        <script>
	        function printPreview() {
	        	window.print();
	        }
        </script>
        <link rel="stylesheet" type="text/css" href="/css/bootstrap.min.css" />
        <link rel="stylesheet" type="text/css" href="/css/bootstrap-theme.min.css" />
        <link href="/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
        
        <script type="text/javascript" src="/js/libs/bootstrap.min.js"></script>
        <link rel="stylesheet" type="text/css" href="/css/style.css" />
    </head>
    <body>
    	<header class="navbar navbar-default navbar-fixed-top" role="navigation">
	        <div class="container">
	            <div class="navbar-header">
	                <div class="navbar-brand">Invoice Preview</div>
	            </div>
	            <div class="navbar-collapse collapse">
	            	<div class="nav navbar-nav navbar-right">
	            		<button name="print_invoice" id="print_invoice" class="invoice_action" onclick="printPreview();">
	            			<i class="fa fa-print"></i>
	            			<span>Print</span>
	            		</button>
	            		<button name="pdf_invoice" id="pdf_invoice" class="invoice_action">
	            			<i class="fa fa-file-pdf-o"></i>
	            			<span>View PDF</span>
	            		</button>
	            	</div>
	            </div>
	        </div>
	    </header>

    	<!--<div id="buttonsbar" class="noPrint">
    		<div id="clickToBrowserPrint" onclick="printPreview();">PRINT PREVIEW <i class="fa fa-print"></i></div>
    		<div id="clickToConvertPDF" onclick="return false;">PDF CONVERSION <i class="fa fa-file-pdf-o"></i></div>
    	</div>-->
    	<div class="container invoice_container" id="invoice_container">
    		{% include 'invoice.html' %}
    		<!--Template fattura con chiave {{chiave_fattura}} del valore di {{valore_fattura}} euro per {{user_mail}}- - >
    		<div id="invoice_loader" class="invoice_loader">
    			<img src="/imgs/loader.GIF" />
    		</div>-->
    	</div>

    	<!--<script type="text/javascript">
    		$(function(){
    			$('#invoice_container').load("/templates/invoice.html");	
    		});
    	</script>-->
    </body>
</html>
